<template>
    <div>
        <workbench ref="workbench" v-show="active == 'workbench'" @refresh="getTodoCount"></workbench>
        <flowCenter :visible="active == 'flowCenter'" @toIndex="toIndex" @addFromProcess="addFromProcess"></flowCenter>
        <myInfo v-show="active == 'myInfo'"></myInfo>

        <!--TabBar区域-->
        <van-tabbar v-model="active">
            <van-tabbar-item name="workbench" icon="home-o" :badge="todoCount || ''">
                工作台
            </van-tabbar-item>
            <van-tabbar-item name="flowCenter" size="5em">
                <template #icon>
                    <van-icon name="plus" class="bg-round"/>
                </template>
            </van-tabbar-item>
            <van-tabbar-item name="myInfo" icon="user-o">
                我的
            </van-tabbar-item>
        </van-tabbar>
    </div>
</template>

<script>

    import workbench from './workbench';
    import myInfo from '../aboutme/myInfo';
    import flowCenter from '../bpmTask/flowCenter';

    export default {
        name: 'index',
        components: {
            workbench,
            myInfo,
            flowCenter,
        },
        data() {
            return {
                active: 'workbench',
                todoCount: null,
                url: {
                    getTodoCount: '/api/bpm/bpm-front/taskRest/getTodoCount',
                }
            }
        },
        created() {
            this.getTodoCount();
        },
        methods: {
            toIndex() {
                this.active = 'workbench';
            },
            addFromProcess(processDefId) {
                this.$refs.workbench.addFromProcess(processDefId);
            },
            getTodoCount() {
                this.$mask.open();
                this.$http.get(this.url.getTodoCount, {
                    params: {
                        taskType: '0',
                    }
                }).then((res) => {
                    const todoTotal = res.result.todoTotal || 0;
                    const readTotal = res.result.readTotal || 0;
                    this.todoCount = Number(todoTotal) + Number(readTotal);
                }).catch((err) => {
                    this.$notify({type: 'warning', message: '请求失败: ' + err, duration: 2000,});
                }).finally(() => {
                    this.$mask.close();
                });
            }
        }
    }
</script>
